<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/inc/taglibs.jsp"%>
<script type="text/javascript">
function processBack(response){
	alertMsg.correct(response.message);
	 $.pdialog.closeCurrent();
	 navTab.reload("${path }/admin/areaInfo", "");
}
var areaId = "${model.areaId}";
var provinceCodeId = $('#provinceCode');
var provinceId = $('#province');
var cityCodeId = $('#cityCode');
var cityId = $('#city');
var districtCodeId = $('#districtCode');
var districtId = $('#district');
var radia_input = $("input[name='r1']");
$(document).ready(function(e) {
	if(areaId == "" || areaId ==  null) {
		// 省份
		setOption("0", provinceCodeId);
		// 设置城市
		provinceCodeId.change(function() {
			var provinceCode = provinceCodeId.val();
			setOption(provinceCode, cityCodeId);
			var index = this.selectedIndex;
			var text = this.options[index].text;
			provinceId.val(text);
		});
		// 设置地区
		cityCodeId.change(function() {
			var cityCode = cityCodeId.val();
			setOption(cityCode, districtCodeId);
			var index = this.selectedIndex;
			var text = this.options[index].text;
			cityId.val(text);
		});
		districtCodeId.change(function() {
			var index = this.selectedIndex;
			var text = this.options[index].text;
			districtId.val(text);
		});
		radia_input.click(function(){
			var val = $("input[name='r1']:checked").val();
			console.log(val);
			if (val == 1) {
				districtCodeId.removeAttr('disabled');
				var text = $('#districtCode option:selected').text();
				districtId.val(text);
				$('#newDistrict').attr('disabled', 'disabled');
				console.log(val);
			} else {
				console.log(val);
				$('#newDistrict').removeAttr('disabled');
				districtId.val($('#newDistrict').val());
				districtCodeId.attr('disabled', 'disabled');
			}
		});
		$("#newDistrict").bind({"focus":function () {
		}, "blur":function () {
			districtId.val($('#newDistrict').val());
		}});
	}
});

// 设置option
function setOption(parentId, optionId) {
	var areaInfo = getSubAreaInfo(parentId);
	var area_option = '<option>请选择</option>';
	for (var i = 0; i < areaInfo.length; i++) {
		area_option = area_option + '<option value="'+areaInfo[i].areaCode+'">'+areaInfo[i].areaName+'</option>';
	}
	optionId.html(area_option);
}
function getSubAreaInfo(parentId) {
	var area = null;
	$.ajax({
		type : "get",
		async : false,
		url : "${path }/admin/areaInfo/getSubArea.json",
		data :{parentId:parentId},
		dataType : 'json',
		contentType : 'application/x-www-form-urlencoded',
		scriptCharset : 'utf-8',
		success : function(json) {
			if(json) {
				area = json;
			}
		}
	});
	return area;
}

</script>
<c:choose>
	<c:when test="${model.id==0 ||empty model.id}">
		<c:set var="action" value="${path }/admin/areaInfo/add.do"></c:set>
	</c:when>
	<c:otherwise>
		<c:set var="action" value="${path }/admin/areaInfo/update.do"></c:set>
	</c:otherwise>
</c:choose>
<div class="pageContent">
	<form method="post" action="${action }" class="pageForm required-validate" onsubmit="return validateCallback(this, processBack);">
		<input name="id" type="hidden" size="75" value="${model.id }"/>
		<input name="areaId" type="hidden" size="75" value="${model.areaId }"/>
		<input type="hidden" name="rel" value="${rel}"/>
		<c:choose>
		<c:when test="${not empty model.id}">
			<div class="pageFormContent" layoutH="57" align="left">
				<p class="nowrap">
	            	<label>省份：</label>
	            	<input type="text" id="province" name="province" value="${model.province }"/>
	            </p>
				<p class="nowrap">
	            	<label>城市：</label>
		            <input type="text" id="city" name="city" value="${model.city }"/>
	            </p>
				<p class="nowrap">
		            <label>地区：</label>
		            <input type="text" id="district" name="district" value="${model.district }"/>
	            </p>
	            <p class="nowrap">
	            	<label>详细地址：</label>
					<input name="address" type="text"  value="${model.address }" />
	            </p>
	            <p class="nowrap">
	            	<label>邮政编码：</label>
					<input name="postNumber" type="text" minlength="6" maxlength="6" class="digits" value="${model.postNumber }" />
	            </p>
			</div>
		</c:when>
		<c:otherwise>
			<div class="pageFormContent" layoutH="57" align="left">
				<p class="nowrap">
	            	<label>省份：</label>
					<select id="provinceCode" name="provinceCode" class="required">
		            </select>
		            <input type="hidden" id="province" name="province" />
	            </p>
				<p class="nowrap">
	            	<label>城市：</label>
					<select id="cityCode" name="cityCode" class="required">
		            </select>
		            <input type="hidden" id="city" name="city" />
	            </p>
				<p class="nowrap">
		            <label><input type="radio" name="r1" checked="checked" value="1">已有地区：</label>
		            <select id="districtCode" name="districtCode" class="required">
		            </select>
		            <input type="hidden" id="district" name="district" />
	            </p>
	            <p class="nowrap">
		            <label><input type="radio" name="r1" value="2">新地区：</label>
		            <input type="text" id="newDistrict" name="newDistrict" disabled="disabled"/>
	            </p>
	            <p class="nowrap">
	            	<label>详细地址：</label>
					<input id="address" name="address" type="text" />
	            </p>
	            <p class="nowrap">
	            	<label>邮政编码：</label>
					<input id="postNumber" name="postNumber" minlength="6" maxlength="6" class="digits" type="text" />
				</p>
			</div>
		</c:otherwise>
		</c:choose>
		<div class="formBar">
			<ul>
			<li><div class="buttonActive"><div class="buttonContent"><button type="submit">保存</button></div></div></li>
				<li>
					<div class="button"><div class="buttonContent"><button type="button" class="close">返回</button></div></div>
				</li>
			</ul>
		</div>
	</form>
</div>
